
{extend name='index@template/base'}{/extend}
{block name='style'}
<link rel="stylesheet" href="__STATIC__/plugins/bootstrap-treeview/bootstrap-treeview.min.css">
{/block}
{block name='script'}
<script src="__STATIC__/plugins/bootstrap-treeview/bootstrap-treeview.min.js"></script>
{/block}
{block name='content'}
<div class="wrapper">
    <div class="wrapper">
        <div class="row app" style="padding: 20px;">
            <div class="col-md-4 col-sm-4">
                <div id="tree"></div>
            </div>
            <div class="col-md-8 col-sm-8">
                <div id="menu_box" class="box box-success">
                    <div class="box-header with-border">
                        <h4 class="box-title">  基本配置</h4>
                    </div>
                    <div class="box-body">
                        <div class="form-group">
                            <label class="control-label col-xs-2">标题</label>
                            <div class="col-xs-10">
                                <input type="text" class="form-control" name="title" id="title" value="默认菜单">
                                <span class="help-block">仅用于区分个性化菜单</span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-2">菜单名称</label>
                            <div class="col-xs-10">
                                <input id="name" type="text" class="form-control" name="name" value="菜单名称">
                                <span class="help-block">仅用于区分个性化菜单</span>
                            </div>
                        </div>
                        <div id="detail">
                            <div class="form-group">
                                <label class="control-label col-xs-2">类型</label>
                                <div class="col-xs-10">
                                    <input  type="radio" name="ipt"  value="view"> 链接
                                    <input  type="radio" name="ipt" value="click"> 触发关键字
                                    <span class="help-block"></span>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-xs-2"></label>
                                <div class="col-xs-10">
                                    <input id="url" type="text" class="form-control" name="url">
                                    <span class="help-block">仅用于区分个性化菜单</span>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-sm-9 col-sm-offset-3">
                                <button onclick="add_node()" type="button" class="btn btn-primary save_btn">&nbsp;&nbsp;保存&nbsp;&nbsp;</button>
                                <button type="button" class="btn btn-default radius ml-20" onclick="layer_close();">&nbsp;&nbsp;取消&nbsp;&nbsp;</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <nav class="navbar navbar-default navbar-fixed-bottom" role="navigation">
            <div class="container-fluid">
                <a class="sx_navbar-brand" href="#" onclick="add_to_server()">确定添加</a>
            </div>
        </nav>


    </div>
</div>
{/block}
{block name='script_extra'}
<script>
    var tree = [
        {
            text: "Parent 1",
            nodes: [
                {
                    text: "Child 1",
                    nodes: [
                        {
                            text: "Grandchild 1"
                        },
                        {
                            text: "Grandchild 2"
                        }
                    ]
                },
                {
                    text: "Child 2"
                }
            ]
        },
        {
            text: "Parent 2"
        },
        {
            text: "Parent 3"
        },
        {
            text: "Parent 4"
        },
        {
            text: "Parent 5"
        }
    ];
    function getTree() {
        // Some logic to retrieve, or generate tree structure
        return tree;
    }

    $('#tree').treeview({data: getTree()});
</script>
<script>
    $("#form").Validform({
        tiptype:2,
        showAllError:true,
        ajaxPost: true,
        callback: function (res) {
            if (res.success == true){
                layer.msg(res.message, {time: 1000},function () {
                    layer_close();
                    parent.$('#table').bootstrapTable('refresh');
                });
            }
        }
    });
</script>


{/block}